{% extends "base.html" %}

{% block title %}{{building}}{% endblock %}

{% block header-left %}CAL PORTAL{% endblock %}
{% block header-right %}{{building|upper}}{% endblock %}

{% block head %}
<script>
function getUrlVars() {
  var vars = [], hash;
  var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
  for(var i = 0; i < hashes.length; i++)
  {
    hash = hashes[i].split('=');
    vars.push(hash[0]);
    vars[hash[0]] = hash[1];
  }
  return vars;
}

$(document).ready(function(){
  $("#time_block").change(function(){
    var time_block_pk = $("#time_block option:selected").val();
    window.location = "/building/{{building.shortname}}/?time_block=" + time_block_pk;
  });
  
  var url_vars = getUrlVars();
});
</script>
{% endblock %}

{% block container %}
<div class="row">
  <div class="span12">
    Current timeblock:
    <select id="time_block">
      {% for time_block_option in time_blocks %}
        <option value="{{time_block_option.pk}}" 
            {% if time_block_option == time_block %}selected="selected"{% endif %}>
          {{time_block_option}}
        </option>
      {% endfor %}
    </select>
  </div>
  {% for room, meta in rooms %}
    <div class="span4">
      <div class="well">
        <h3>
          <a class="room_link" href="/room/{{building.shortname}}/{{room.name}}/?time_block={{time_block.pk}}">{{room}}</a>
          <br><small>
          {% if meta.sections.0 %}
            {{meta.sections.0}} {{meta.sections.0.time}}
          {% else %}
            No ongoing class
          {% endif %}
        </small></h3>
        {% if meta.sections.0 %}
          <h4>{{meta.sections.0.course.title}}</h4>
          {{meta.sections.0.course.description}}
        {% endif %}
      </div>
    </div>
  {% endfor %}
</div>
{% endblock %}